import React, { useState } from 'react'
import { Button, Popup, Space } from 'react-vant';
import { objKey } from "./config"
import { httpPost } from '@/axios';

const ConfimView = ({ popupVis, sureData, onCancel, onOk, url = '' }) => {
    const [loading, setLoading] = useState(false)
    const confimOnok = async () => {
        setLoading(true)
        const res = await httpPost(url, sureData);
        setLoading(false)
        if (res) {
            onOk()
        }
    }
  return (
    <Popup round style={{ width: "80%" }} visible={popupVis}>
        <div style={{ background: "linear-gradient( 180deg, #FFFFFF 0%, #EBF7FF 100%)" }}>
            <div style={{ padding: "20px 20px 20px 20px" }}>
                {(Object.keys(sureData) || []).map((item, index) => {
                    return item !== 'id' && (
                        <div style={{ padding: 5, fontSize: 16 }} key={index}>{objKey[item]}: {sureData[item]}</div>
                    )
                })}
            </div>
            <div style={{ width: "100%", backgroundColor: "transparent", display: "flex", alignItems: 'center', justifyContent: "center", padding: "20px 0px" }}>
                <Space>
                    <Button onClick={onCancel} round style={{ width: 120, boxShadow: "0px 0px 9px 0px rgba(0,0,0,0.21)", fontSize: 18, color: "#808080" }}>取消</Button>
                    <Button loading={loading} onClick={confimOnok} round style={{ width: 120, background: "linear-gradient( 90deg, #59B8EF 0%, #1677FF 100%)", boxShadow: '0px 0px 9px 0px rgba(0,0,0,0.5)', fontSize: 18, color: "#fff", border: "none" }}>确认</Button>
                </Space>
            </div>
        </div>
    </Popup>
  )
}

export default ConfimView;
